//通过函数返回最新的Variable变量表 更新样式

const generateSlider = (Variables)=>{
    return {
       //滑动锚点选中颜色
       activeDotColor:Variables.colorBrand5,
       //滑动锚点未选中颜色
       noactiveDotColor:Variables.colorGray3,
       //轮播区域高度
       itemSliderHeight:Variables.sizeHeightXs,
       //圆点距离下边距的距离
       dotPaddingBottom:Variables.spacingS,
       //圆点左右边距
       pagationMarginVertical:Variables.spacingM,
       //外部圆点容器背景色
       paginationDotBgColor: Variables.colorWhite1,
       //外部圆点距离图片上边距
       dotToImgVertical:Variables.spacingXs,
       //内部圆点容器背景色
       innerDotBgColor:Variables.colorGray7
    }
}

const getSliderStyle =(Variables)=>{
    let SliderStyle = generateSlider(Variables)
    let styles = {
        marqueeContainer: {
            flexDirection: 'column',
            alignItems: 'center'
        },
        paginationContainer: {
            width: '100%',
            paddingTop: SliderStyle.dotToImgVertical,
            // paddingBottom:SliderStyle.dotPaddingBottom,
            position: 'absolute',
            bottom: 0,
            left:0
        },
        paginationDot: {
            width: 6,
            height: 6,
            borderRadius: 3,
            // borderWidth: 1,
            // borderColor: '#FFF',
            marginHorizontal: 2,
        },
        otherPaginationDot: {
            width: 8,
            height: 3,
            borderRadius: 0,
            // borderColor: 'transparent'
        },
        count: {
            alignItems: 'center',
            justifyContent: 'center',
            marginVertical: 10,
            height: 25,
            width: 70,
            borderRadius: 13,
            borderWidth: 1,
            borderColor: SliderStyle.activeDotColor,
        },
        slideInnerContainer: {
            paddingHorizontal: 0,
            flexDirection: 'column',
         
        },
        imageContainer: {
            padding: 0,
            marginHorizontal: 15,
            marginVertical: 10,
          
        },
        imageStyle: {
            resizeMode: 'stretch',	
        },
        itemContainer: {
            justifyContent: 'center',
        }
     
        
    }
    return {
        SliderStyle,styles
    }
}

export { getSliderStyle }